@import '@/styles/variables.scss';
@mixin gen_card($spaces) {
  .card {
    background-color: #314362;
    border-radius: $radius;
    box-shadow: 0 0 14px rgba($black-color, 0.5);
    .card-header {
      border-bottom: solid 1px map-get($border-colors, light);
     
      font-size: map-get($font-sizes, md);
    }
    .card-body {
      
    }
    .card-footer {
      
    }
  }

  @each $key, $val in $spaces {
    .card.gap_#{$key} {
      .card-header,
      .card-body,
      .card-footer {
        padding: $val;
      }
    }
  }
}

@include gen_card($spaces);
